

//分页器功能
define(['jquery','paging'],()=>{
    class list{
        constructor(ele,start,end,url){
            this.ul=document.querySelector(ele);
            this.start=start;
            this.end=end;
            this.url=url;
            this.init();
        }
        init(){
            this.request();
        }
        request(){
            $.ajax({
                url: this.url,
                type:'get',
                dataType:'json'
            })
            .then((res)=>{
                let data = res.slice(this.start, this.end);
                this.render(data);

                });
        }
        render(data){
            data.forEach((item)=>{
                this.ul.innerHTML += `
                    <li>
                        <a href="/html/details.html?id=${item.goods_id}" style="text-decoration:none; color:black;">
                        <div class="pic">
                            <img src="${item.img_small_logo}">
                        </div>
                        <p class="title hide">${item.title}</p>
                        <p class="price">${item.price}</p>
                        </a>
                    </li> 
                `
            });
            $(".paging_list").paging({
                PageNum: 20, //每页显示数目
                pageMax: true, //按钮长度是否显示
                pageMaxHideShow: false, //在最后一个的时候是否隐藏按钮长度
                pageDownUpHide: false, //到第一个或最后一个是否让上一页或下一页消失
                pageInput: true, //是否使用文本框输入跳转
                pagingBtnHide: false, //是否让按钮变为一个
                pagingBtnPaging: true,//按钮是否分页
                pagingDisplay: "flex"//显示的属性，弹性盒子还是块化
            })
        }
        
    }
    // <button data-id=${item.goods_id}>加入购物车</button>
    return list
});